<!DOCTYPE html>
<%@ page pageEncoding="UTF-8"%>
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>

<html lang="zh">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>云南公安网安安全监管平台</title>
    <link rel="icon" href="./images/logo.png" type="image/x-icon">
    <link rel="stylesheet" href="./css/login.css">

</head>
<body>
<div class="main">
    <div class="stars"></div><div class="stars stars-delay"></div>

    <div class="login-box">
        <div class="login-info" id="login">

            <h1><img  src="./images/login-logo.png" alt="云南公安网安安全监管平台"/></h1>


            <div class="login-form">

                <form:form method="post" id="fm1" commandName="${commandName}" htmlEscape="true">
                    <div style="display: none;">
                    <form:errors path="*" id="msg" cssClass="errors" element="div" htmlEscape="false" />

                    <h2><spring:message code="screen.welcome.instructions" /></h2>
</div>
                    <section class="row">
                        <c:choose>
                            <c:when test="${not empty sessionScope.openIdLocalId}">
                                <strong><c:out value="${sessionScope.openIdLocalId}" /></strong>
                                <input type="hidden" id="username" name="username"
                                       value="<c:out value="${sessionScope.openIdLocalId}" />" />
                            </c:when>
                            <c:otherwise>
                                <spring:message code="screen.welcome.label.netid.accesskey"
                                                var="userNameAccessKey" />
                                <form:input class="login-input"
                                            id="username" size="20" maxlength="20" tabindex="1"
                                            accesskey="${userNameAccessKey}" path="username"
                                            autocomplete="off" htmlEscape="true" placeholder="用户名" onfocus="this.placeholder=''" onblur="this.placeholder='用户名'"/>
                            </c:otherwise>
                        </c:choose>
                    </section>

                    <section class="row">
                        <spring:message code="screen.welcome.label.password.accesskey"
                                        var="passwordAccessKey" />
                        <form:password class="login-input"
                                       id="password" size="20" maxlength="20" tabindex="2" path="password"
                                       accesskey="${passwordAccessKey}" htmlEscape="true"
                                       autocomplete="off" placeholder="密码" onfocus="this.placeholder=''" onblur="this.placeholder='密码'"/>
                <span id="capslock-on" style="display: none;"><p>
                    <img src="images/warning.png" valign="top">
                    <spring:message code="screen.capslock.on" />
                </p></span>
                    </section>

                    <!--
                    <section class="row check">
                    <p>
                    <input id="warn" name="warn" value="true" tabindex="3" accesskey="<spring:message code="screen.welcome.label.warn.accesskey" />" type="checkbox" />
                    <label for="warn"><spring:message code="screen.welcome.label.warn" /></label>
                    <br/>
                    <input id="publicWorkstation" name="publicWorkstation" value="false" tabindex="4" type="checkbox" />
                    <label for="publicWorkstation"><spring:message code="screen.welcome.label.publicstation" /></label>
                    <br/>
                    <input type="checkbox" name="rememberMe" id="rememberMe" value="true" tabindex="5"  />
                    <label for="rememberMe"><spring:message code="screen.rememberme.checkbox.title" /></label>
                    </p>
                    </section>
                    -->

                    <section class="row btn-row">
                        <input type="hidden" name="lt" value="${loginTicket}" />
                        <input type="hidden" name="execution" value="${flowExecutionKey}" />
                        <input type="hidden" name="_eventId" value="submit" />

                        <%--<input class="btn-submit" name="submit" accesskey="l" value="<spring:message code="screen.welcome.button.login" />" tabindex="6" type="submit" />--%>
                        <%--<input class="btn-reset" name="reset" accesskey="c" value="<spring:message code="screen.welcome.button.clear" />" tabindex="7" type="reset" />--%>

                        <input id="login-button" class="login-btn btn-submit" name="submit" readonly="readonly"
                               accesskey="l"
                               value="<spring:message code="screen.welcome.button.login" />"
                               tabindex="6" type="button"></input>

                    </section>


                </form:form>

            </div>


        </div>
    </div>
    <div class="footer">
        技术支持：<a href="//www.cetc-cloud.com" target="_blank">中国电子科技网络信息安全有限公司</a>
    </div>




    <div class="login-wrap">

    </div>

    <script type="text/javascript" src="./js/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="./js/layer/layer.js"></script>
    <script type="text/javascript" src="./js/prefixfree.min.js" ></script>
    <script>
        $(function() {
            $('#kaptcha').val("");

            var showMsg = function() {
                var $msg = $('#msg')
                if ($msg && $msg.text()) {
                    if (!$msg.find('br').length) {
                        layer.msg($msg.text(), {icon: 2, time: 1000});
                    }
                }
            }

            $('form').on('focus', 'input', function(event) {
                event.preventDefault()
                $('#login-button').val('登录').css('color', '#fff')
            })

            $('form').on('keypress', 'input', function(event) {
                if(event.keyCode == "13")
                {
                    $('#login-button').click()
                }
            })

            $('#kaptcha').focus(function(){
                $(this).val('')
            })

            showMsg()

            $('#login-button').click(
                    function() {
                        if($('#username').val() == ''){
                            layer.msg('请输入正确的用户名！', {icon: 2, time: 1000});
                            return;
                        }
                        else if($('#password').val() == ''){
                            layer.msg('请输入正确的密码！', {icon: 2, time: 1000});
                            return;
                        }
                        var rt = true;
                        $.ajax({
                            url: 'userInfo',
                            type: 'post',
                            async: false,
                            data: {userName: $('#username').val(), password: $('#password').val()},
                            success: function (data) {
                                if (data == 0) {
                                    layer.msg('该警员未留存手机号码！', {icon: 2, time: 1000});
                                    rt = false;
                                    return;
                                }

                                if (data != 9 && data != 0 && data != 2 && $('#kaptcha2').val() == '') {
                                    layer.msg('请输入正确的手机验证码！', {icon: 2, time: 1000});
                                    rt = false;
                                    return;
                                }
                            }
                        });
                        if(rt) {
                            $('#login-button').attr('type','submit');
                            $('#fm1').submit();
                        }
                    });

            var t = 0;
            $('#getSms').off("click").on("click", function() {
                if($('#username').val() == ''){
                    layer.msg('请输入正确的警员编号！', {icon: 2, time: 1000});
                    return;
                }

                if (t != 0) {
                    return;
                }
                var self = $(this);
                $.ajax({
                    url: 'userInfo',
                    type: 'post',
                    data:{userName: $('#username').val(),password: $('#password').val()},
                    success: function(data){
                        var phonenum = data;
                        if(data == 0){
                            layer.msg('该警员未留存手机号码！', {icon: 2, time: 1000});
                            return;
                        }
                        else if(data == 2){
                            layer.msg('IP验证方式请直接登录！', {icon: 2, time: 1000});
                            return;
                        }

                        $.ajax({
                            url: 'smskaptcha?phoneNum=' + phonenum,
                            type: 'get',
                            success: function(data){
                                layer.msg('动态密码已发送成功！', {icon: 6, time: 2000});

                                t = 120;
                                setTime();
                            }
                        });
                    }
                });
            })


            function setTime(){
                if (t > 0) {
                    $('#getSms').text(t + 's后重试');
                    t--;
                    setTimeout(function(){
                        setTime();
                    }, 1000);
                } else {
                    $('#getSms').text('点击获取动态密码');
                }
            }
        })
    </script>
</body>
</html>